<script setup>
const props = defineProps({
  field: {
    type: String,
    default: ''
  }
})
const emit = defineEmits(['confirm', 'clear', 'setFullScreen'])
const confirmSign = (data, field) => {
  emit('confirm', data, field)
}
const clearSign = (field) => {
  emit('clear', field)
}
const setFullScreen = () => {
  emit('setFullScreen', true)
}
</script>

<template>
  <view class="box">
    <view class="sign">
      <nut-signature
          @confirm="(canvas, data) => confirmSign(data, field)"
          @clear="clearSign(field)"
      />
    </view>
    <view class="btn-fs">
      <nut-button type="primary" @click="setFullScreen">全屏</nut-button>
    </view>
  </view>
</template>

<style scoped lang="scss">
.box{position: relative;}
.btn-fs{position: absolute;bottom: 0;left: 160px;}
</style>
